<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery/jquery-3.6.0.js"></script>
</head>
<body>
  hello html  虚拟服务无法调用网络接口访问  主要的作用是开发静态页面
追加一些内容  对于html渐进式框架，都可以使用此调用方式
  <br/>
  <input type="text" id="username">
  <input type="text" id="password">
  <br/>
  <button>ajax提交</button>
</body>
<script>
    $(function () {   // 当页面整体代码加载完成，才会执行这里的js代码
        $("button").click(function () {
            let username = $("#username").val();
            let password = $("#password").val();
            // ajax
            $.ajax({
                url:"/order/test03",            // 请求路径
                type:"post",                  // 请求的方式，不区分大小写
                cache:false,                  // 关闭缓存，目的是为了避免部分浏览器缓存加载出错(IE)
                data: {                       // 传递给服务器的数据  左为key  右为value  后端通过key获取到value值
                    username:username,
                    password:password
                },
                datatype:"json",               // 返回类型，text文本、html页面、json数据
                success:function(response){    // 这里的response代表服务器返回的json对象
                    console.log("返回: " + response);
                    if(response.code === 200) {
                        alert("登录成功!");
                    }
                },
                error:function(response){
                    console.log("出错返回: " + response);
                }
            });
        });
    });
</script>
</html>